.question-view {
  width: 100vw;
  height: 100vh;
  background-color: #1D102C;

  .image-view {
    position: absolute;
    left: 0;
    height: 55vh;
    width: 100vw;
    z-index: 0;
  }

  .content-view{
    position: absolute;
    bottom: 0;
    z-index: 2;
  }
.barrage-fly-view{
    height: 30vh;
}
  .barrage-fly {
    position: absolute;
    .barrage-textFly {
      word-break:keep-all;
      background-color: rgba(112, 45, 184, 0.5);
      border-radius: 44px;
      color: #B8AAC3;
      font-size: 16px;
      height: 16px;
      line-height: 35px;
      padding: 3px 8px;
    }
  }

  @keyframes first {
    from {
      left: 100vw;
    }
    to {
      left: -700px;
    }
  }


  .input-parent-view {

    width: 100vw;
    text-align: center;
    padding-top: 10px;
    background-color: #1D102C;
    .input-view {
      text-align: left;
      font-size: 14px;
      width: calc(~"100vw - 70px");
      height: 120px;
      margin: 10px 25px;
      padding: 10px;
      background-color: #FFFFFF;
    }


    .bottom-view {


      .coupon-parent-view {
        background-color: #493d57;
        height: 30px;
        width: 100vw;

        .coupon-text-view{
          display: flex;
          justify-content: space-between;
          padding: 0 40px;
          color: #FFFFFF;
          font-size: 16px;
          line-height: 30px;
        }


        .down-img {
          position: absolute;
          width: 15px;
          height: 13px;
          padding: 10px;
          right: 0;
          z-index: 5;
        }

        .coupon-view {
          position: relative;
          display: inline-block;
          top: 25px;
          .coupon-view-img {
            width: 165px;
            height: 67px;
          }
          .checkmark-img{
            position: absolute;
            right: 0;
            margin-right: 10px;
            width: 20px;
            height: 20px;
          }

          .coupon-text {
            position: absolute;
            text-align: center;
            top: 10%;
            left: 50px;
            color: #FFFFFF;
            font-size: 18px;
          }

        }


      }

      .pay-view {
        height: 71px;
        background-color: #FFFFFF;
        color: #5b08a4;
        font-weight: bold;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0 30px;

        .go-pay-view {
          background-color: #5b08a4;
          padding: 4px 18px;
          height: 24px;
          border-radius: 25px;
          color: #FFFFFF;
          font-size: 16px;
          text-align: right;
          font-weight: normal;
        }

        .fz-18 {
          font-size: 18px;
        }

        .fz-24 {
          font-size: 24px;
        }

        .fz-36 {
          font-size: 36px;
        }

      }


    }


  }


  .current-word-num {
    position: absolute;
    font-size: 10px;
    color: #A8A8A8;
    bottom: 5px;
    right: 35px;
    z-index: 2;
  }

  .button-image {
    width: 120px;
    height: 40px;
    margin-top: 10px;
  }


}